<script lang="ts" setup>
const message = useMessage()
const notification = useNotification()
const dialog = useDialog()
const loadingBar = useLoadingBar()
const cb1 = () => {
  message.info('message')
}
const cb2 = () => {
  notification.info({ title: 'notification' })
}
const cb3 = () => {
  dialog.info({ title: 'dialog' })
}
const cb4 = () => {
  loadingBar.start()
  setTimeout(() => {
    loadingBar.finish()
  }, 1000)
}
</script>

<template>
  <NSpace>
    <NButton @click="cb1">
      useMessage
    </NButton>
    <NButton @click="cb2">
      useNotification
    </NButton>
    <NButton @click="cb3">
      useDialog
    </NButton>
    <NButton @click="cb4">
      useLoadingBar
    </NButton>
  </NSpace>
</template>
